<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <title>成功</title>
    <meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">

    <link rel="stylesheet" th:href="@{/plugins/elementui/index.css}">

    <link rel="stylesheet" th:href="@{/plugins/font-awesome/css/font-awesome.min.css}">

    <link rel="stylesheet" th:href="@{/css/style.css}">
</head>
<body>
<div id="app">

    <div align="center">
        <font face="楷体" size="10" >
            <b style="color: #66b1ff">恭喜！恭喜！操作成功辣！！！</b>
        </font>
    </div>

    <div class="app-container" align="center">
        <div class="box"><!--这一box布局代表一条水平分割线-->
            <div class="filter-container">
                <el-button type="primary" class="butT" @click="goFileMain()" style="width: 200px;">反回操作区</el-button>
            </div>
        </div>
    </div>
</div>
</body>

<!-- 引入组件库 -->
<script th:src="@{/js/vue.js}"></script>
<script th:src="@{/plugins/elementui/index.js}"></script>
<script th:src="@{/js/jquery.min.js}"></script>
<script th:src="@{/js/axios-0.18.0.js}"></script>

<script>
    var vue = new Vue({
        el: '#app',
        //这个data里面定义的数据是在上面页面中已经有的被命名好的数据总称，且他们之间的内容是一样的
        data:{
            dataList: [],//定义了当前页要展示的列表数据
            dialogFormVisibleCreate: false,//创建文件表单是否可见
            dialogFormVisibleEdit:false,//重命名文件表单是否可见
            dialogFormVisibleMove:false,//移动文件表单是否可见
            dialogFormVisibleOpen:false,//进入文件夹按钮是否可见
            formData: {},//定义收集的表单数据
            rules: {
                filename: [{ required: true, message: '文件名称为必填项', trigger: 'blur' }]
            },//定义校验规则
            pagination: {
                currentPage: 1,//当前页码
                pageSize:10,//每页显示的记录数
                total:0,//总记录数（刚开始不知道，所以指定为零）
                filePath: "/",
                filename: ""
            }//定义分页相关模型数据
        },

        //钩子函数，VUE对象初始化完成后自动执行，在浏览器中输入 http://localhost:8080/pages/books.html 地址后，自动会执行 created() 中的代码，从而实现填充页面
        created() {
            //调用查询全部数据的操作
            this.getAll();
        },

        //这个method中定义的方法都是在上面页面中被指定的某一个控件被点击之后会执行的方法，相当于就是事件监听
        methods: {

            goFileMain(){
                axios.get("http://localhost:8080/document/users/file").then((res)=>{
                    location.href='http://localhost:8080/document/users/file'
                });
            }
        }
    })
    /*location.href 现在我掌握的信息来看，能用于get请求，但是post请求会有问题*/
</script>
</html>